<template>
  <el-dialog title="匹配项目" size="75%" @close="closeDialog" :visible.sync="dialog"
             :modal-append-to-body="false" :append-to-body='true'>
    <avue-form ref="form" :option="option" v-model="form">
      <template slot="testStdNoLIMS">
        <smart-input ref="itemNameSmartInput" placeholder="方法号(LIMS)" readonly v-model="form.testStdNoLIMS"
                     v-bind="testStdNoLIMSInputOption" :onSelected="selectTestItem"/>
      </template>
      <template slot="menuForm">
        <el-button type="primary" @click="handleEdit">修改</el-button>
      </template>
    </avue-form>
  </el-dialog>
</template>

<script>
import {mapGetters} from "vuex";

export default {
  data() {
    return {
      loading: true,
      form: {},
      query: {},
      page: {
        currentPage: 1,
        pageSize: 10,
        total: 0
      },
      testStdNoLIMSInputOption: { //testStdNoLIMS
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0
        },
        option: {
          column: [
            {label: "项目名称", prop: "name", sortable: true, searchTh: true,},
            {label: "方法号", prop: "testStdNo", sortable: true, searchTh: true,},
            {label: "所属实验室", prop: "labName", sortable: true, searchTh: true,},
            {label: this.$t('base.testStdName'), prop: "testStdName", sortable: true, searchTh: true,},
          ]
        },
        getList(params) {
          this.$set(params, "status", 1);
          return pageTestItem(params.current, params.size, params.ascs, params.descs, Object.assign(params, this.query))
        }
      },
      selectionList: [],
      resultMain: null,
      selectedTestStd: null,
      dialog: false,
      option: {
        size: 'mini',
        tip: false,
        labelWidth: 120,
        index: false,
        border: true,
        submitBtn: false,
        emptyBtn: false,
        delBtn: false,
        addBtn: false,
        viewBtn: false,
        editBtn: true,
        selection: true,
        searchShow: true,
        searchLabelWidth: 120,
        dialogClickModal: false,
        column: [
          {
            label: "项目类别", prop: "testType", sortable: true, type: "select", disabled: true,
            dicData: [
              {label: '监测项目', value: 1},
              {label: '抽检项目', value: 2},
            ],
          },
          {
            label: "项目名称(国抽)", prop: "itemName", sortable: true, searchTh: true, disabled: true,
            rules: [{required: true, message: "请输入国抽项目名称(国抽)", trigger: "blur"}]
          },
          {
            label: "方法号(国抽)", prop: "testStdNo", sortable: true, searchTh: true, disabled: true,
            rules: [{required: true, message: "请输入国抽检测方法号(国抽)", trigger: "blur"}]
          },
          {
            label: this.$t('base.testStdName'), prop: "testStdName", sortable: true, disabled: true,
            rules: [{required: true, message: "请输入检测方法名称", trigger: "blur"}]
          },
          {
            label: this.$t('base.lab'), prop: "labName", sortable: true, disabled: true,
            rules: [{required: true, message: "请输入实验室", trigger: "blur"}]
          },
          {
            label: "方法号(LIMS)", prop: "testStdNoLIMS", sortable: true, formslot: true,
            rules: [{required: true, message: "请选择方法号(LIMS)", trigger: "blur"}]
          },
          {
            label: "项目名称(LIMS)", prop: "itemNameLIMS", sortable: true, disabled: true,
            rules: [{required: true, message: "请输入项目名称(LIMS)", trigger: "blur"}]
          },
        ]
      },
      data: [],
    };
  },
  computed: {
    ...mapGetters(["permission"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.material_add, false),
        viewBtn: this.vaildData(this.permission.material_view, false),
        editBtn: true,
        delBtn: this.vaildData(this.permission.material_delete, false)
      };
    },
    ids() {
      let ids = [];
      this.selectionList.forEach(ele => {
        ids.push(ele.id);
      });
      return ids.join(",");
    }
  },
  methods: {
    handleEdit() {
      if(!this.form.limsItemId){
        this.$message({type: "error", message: "请选择匹配的检验依据!"});
        return;
      }
      let submitObj = {};
      this.$set(submitObj, "sampleCatTestId", this.form.id);
      this.$set(submitObj, "limsItemId", this.form.limsItemId);
      this.$set(submitObj, "columnName", this.selectedTestStd.columnName);
      this.$set(submitObj, "ids", this.resultMain.id);
      this.$set(submitObj, "value", this.selectedTestStd.id);
      updateAndMatch(submitObj).then(res => {
        this.$message({type: "success", message: this.$t('message.success')});
        this.$emit("reLoad", true);
        this.dialog = false;
        this.selectedTestStd = null;
        this.resultMain = null;
        this.form = {};
      }, error => {
        console.log(error);
      });
    },
    selectTestItem(row) {
      //selected testItem call back
      this.$set(this.form, "testStdNoLIMS", row.testStdNo);
      this.$set(this.form, "itemNameLIMS", row.name);
      this.$set(this.form, "labName", row.labName);
      this.$set(this.form, "limsItemId", row.id);
      this.$set(this.form, "isMatch", true);
    },
    closeDialog() {
      //对话框关闭回调
      this.dialog = false;
      this.$emit("reLoad");
    },
    init(resultMain, selectedTestStd, from) {
      this.resultMain = resultMain;
      this.selectedTestStd = selectedTestStd;
      this.form = from;
      this.dialog = true;
    },
  }
};
</script>

<style>
</style>
